<!--Create: LT4-->
<!--Time:   2020年6月16日18:35:21-->
<!--Description:    显示非购物车order（已支付）列表-->
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>已支付订单</title>
    <!--css-->
    <link rel="stylesheet" href="../../../static/css/bootstrap.min.css"
          th:href="@{../../../static/css/bootstrap.min.css}">


</head>
<body>
<header>
    <nav class="navbar navbar-light bg-light navbar-expand">
        <a href="/" class="navbar-brand">Shop</a>
        <div class="collapse navbar-collapse">
            <ul class="navbar-nav">
                <li class="nav-item">
                    <a href="/" class="nav-link active">首页</a>
                </li>
                <form class="form-inline">
                    <input id="searchText" type="text" placeholder="Search" class="form-control"/>
                </form>
                <button id="search" class="btn btn-primary">搜索</button>
            </ul>
        </div>
        <div th:if="${#strings.isEmpty(session.user)}">
            <div class="btn-group">
                <button class="btn btn-primary dropdown-toggle" data-toggle="dropdown">登录</button>
                <div class="dropdown-menu dropdown-menu-right p-2 text-muted" style="width: 300px">
                    <form action="/userLogin" data-stopPropagation="true" method="post">
                        <div class="form-group">
                            <input type="hidden" id="path" name="path" value="/">
                        </div>
                        <div class="form-group" data-stop>
                            <label>用户名:</label>
                            <input id="username" name="username" type="text" class="form-control"
                                   placeholder="username">
                            <div id="noUsername" class="alert alert-danger alert-dismissible fade show"
                                 style="display:none">
                                <strong>用户名不能为空</strong>
                                <button id="noUserBtn" type="button" class="close">&times;</button>
                            </div>
                        </div>
                        <div class="form-group">
                            <label>密码:</label>
                            <input id="password" name="password" type="password" class="form-control"
                                   placeholder="password">
                            <div id="noPassword" class="alert alert-danger alert-dismissible fade show"
                                 style="display:none">
                                <strong>请输入密码</strong>
                                <button id="noPwdBtn" type="button" class="close">&times;</button>
                            </div>
                        </div>
                        <div class="form-group" style="margin-top: 2px">
                            <button id="loginSubmit" type="submit" class="btn btn-primary" style="width: 100%;">登录
                            </button>
                            <span id="err" th:if="${not #strings.isEmpty(loginMsg)}">
                                    <div class="alert alert-danger alert-dismissible fade show">
                                        <strong th:text="${loginMsg}"></strong>
                                        <button type="button" class="close" data-dismiss="alert">&times;</button>
                                    </div>
                                </span>
                        </div>
                        <div class="text-center">
                            <a href="/enroll">>前往注册</a>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <div id="user" th:if="${session.user}">
            <img th:onclick="'javascript:locate(\''+'/user/'+${session.user.id}+'\')'"
                 style="height: 45px;width: 45px;margin-right: 20px"
                 class="rounded-circle dropdown-toggle" data-toggle="dropdown"
                 th:src="${session.user.iconURL!=null}?${session.iconPathPattern}+${session.user.iconURL}:@{/static/img/default.png}">
            <ul class="dropdown-menu dropdown-menu-right p-2 text-muted" role="menu" style="width: 100px">
                <a class="dropdown-item" href="/show/order/list">我的订单</a>
                <a class="dropdown-item"  href="/show/order/cart">我的购物车</a>
                <a th:if="${session.user.state==1}" class="dropdown-item"  href="/dashboard">管理</a>
                <a class="dropdown-item"  href="/logOut">登出</a>
            </ul>
            <span style="padding-right: 40px" th:text="${session.user.getUsername()}"></span>
        </div>

    </nav>

</header>
<br>
<main role="main">
    <div class="container">
        <div th:each="order: ${orders}" class="card " style="margin-bottom: 50px">
            <div class="card-header">
                <div class="row">
                    <div class="col-md-4" th:text="'订单编号:   '+${order.getId()}"></div>
                    <div class="col-md-4" th:text="'订单时间:   '+${order.getTimes()}"></div>
                    <div th:if="${order.state eq 1}" class="col-md-2 offset-md-2" th:text="'订单待发货'"></div>
                    <div th:if="${order.state eq 2}" class="col-md-2 offset-md-2" th:text="'订单待收货'"></div>
                    <div th:if="${order.state eq 3}" class="col-md-2 offset-md-2" th:text="'订单已完成'"></div>
                    <div th:if="${order.state eq 4}" class="col-md-2 offset-md-2" th:text="'订单待退货'"></div>
                    <div th:if="${order.state eq 5}" class="col-md-2 offset-md-2" th:text="'订单已退货'"></div>
                </div>
            </div>
            <div class="card-body">
                <div class="row">
                    <div class="col-md-2">
                        <!--<img th:src="${order.goods.pictures.get(0)}"  class="img-thumbnail" style="width: 75px;height: 75px">-->
                        <img th:src="${goodsPicPath}+${order.goods.pictures.get(0).getPicURl()}" class="img-thumbnail"
                             style="width: 75px;height: 75px">
                    </div>
                    <div class="col-md-8">
                        <div class="card-text">
                            <div class="row" >
                                <p th:if="${not #strings.isEmpty(order.express)}" class="col-md-4" th:text="'物流公司: '+ ${order.express.com}"></p>
                                <p th:if="${not #strings.isEmpty(order.express)}" class="col-md-4" th:text="'物流编号:  '+ ${order.express.nu}"></p>
                                <p th:if="${#strings.isEmpty(order.express)}" class="col-md-6" th:text="'目前未收到物流相关信息，请等待卖家发货...'"></p>
                            </div>



                            <div class="row">
                                <p class="col-md-3" th:text="'商品名:  ' + ${order.goods.name}"></p>
                                <p class="col-md-2" th:text="'售价:   ' + ${order.selling_price}"></p>
                                <p class="col-md-2" th:text="'数量:   ' + ${order.goodsNum}"></p>
                                <p class="col-md-4 font-weight-bold"
                                   th:text="'总价:   ' + ${order.goodsNum}*${order.selling_price}"></p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-2"><br>
                        <a th:if="${not #strings.isEmpty(order.express)}"  class="btn btn-primary"
                           th:href="@{'http://localhost:8000/show/express/details/'+${order.id}}">查询物流详情</a>
                    </div>
                </div>
            </div>
        </div>

    </div>
</main>

<footer class="text-muted" style="position: absolute;left: 35%;top: 850px">
    <div class="row" style="width: 800px">
        <div class="col-md-3 page-item" th:if="${page.getCur() gt 1}">
            <a class="btn btn-primary " th:href="@{/show/order/list/?pageNum={page}(page=${page.getPre()})}">
                < Previous
            </a>
        </div>

        <div class="col-md-3 page-item" th:if="${page.getCur() eq 1}">
            <a class="btn disabled btn-primary " th:href="@{/show/order/list/?pageNum={page}(page=${page.getPre()})}">
                < Previous
            </a>
        </div>

        <div class="col-md-3">
            <p th:text="'当前页：'+${page.getCur()}"></p>
        </div>

        <div class="col-md-3 page-item">
            <a class="btn btn-primary " th:href="@{/show/order/list/?pageNum={page}(page=${page.getNext()})}">
                Next>
            </a>
        </div>

    </div>
</footer>


</body>

<script type="text/javascript" src="../../../static/js/jquery-3.3.1.js"
        th:src="@{../../../static/js/jquery-3.3.1.js}"></script>
<script type="text/javascript" src="../../../static/js/popper.min.js"
        th:src="@{../../../static/js/popper.min.js}"></script>
<script type="text/javascript" src="../../../static/js/bootstrap.min.js"
        th:src="@{../../../static/js/bootstrap.min.js}"></script>

<script type="text/javascript">
    $(function () {
        $(".dropdown-toggle").on("mouseover", function() {
            $(this).dropdown('toggle');
        })
    })
    function locate(string)
    {
        window.open(string);
    }
</script>

</html>



